<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>ASCII 矩形生成器</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <h1>ASCII 矩形生成器</h1>

    <div class="controls">
        <label for="rows">行数:</label>
        <input type="number" id="rows" value="10" min="1" max="50">
        <label for="cols">列数:</label>
        <input type="number" id="cols" value="20" min="1" max="80">
        <button id="createGridBtn">创建/重置网格</button>
        <button id="generateAsciiBtn">生成 ASCII</button>
    </div>

    <div id="gridContainer">
        <!-- 网格将在这里生成 -->
    </div>

    <div class="output-controls">
        <div id="asciiDisplayArea" class="ascii-display-area"></div>
    </div>

    <script src="script.js"></script>
</body>
</html> 